$(function() {
    var layer = layui.layer;
    var laypage = layui.laypage;
    // 定义事件过滤器
    template.defaults.imports.dataFormat = function(date) {
        const dt = new Date(date)
        var y = dt.getFullYear();
        var m = padZero(dt.getMonth() + 1);
        var d = padZero(dt.getDate());

        var hh = padZero(dt.getHours());
        var mm = padZero(dt.getMinutes());
        var ss = padZero(dt.getSeconds());
        return y + "-" + m + "-" + d + " " + hh + ":" + mm + ":" + ss
    };

    // 定义补零函数
    function padZero(n) {
        return n < 10 ? "0" + n : n;
    }
    // 定于一个查询的参数对象，后面请求数据的时候
    // 将请求参数对象提交到服务器
    var q = {
        pagenum: 1, //页码值，默认请求第一页
        pagesize: 2, //每页显示2条数据
        cate_id: "", //文章分类的Id
        state: "" //文章发布状态
    };
    initTable()
    initCate()

    function initTable() {
        $.ajax({
            type: "GET",
            url: "/my/article/list",
            data: q,
            success: function(response) {
                if (response.status !== 0) {
                    return layer.msg("获取文章列表失败！")
                }
                console.log(response);
                var htmlStr = template("tmp_table", response)
                $("tbody").html(htmlStr)
                renderPage(response.total)
            }
        });
    };

    function initCate() {
        $.ajax({
            type: "GET",
            url: "/my/article/cates",
            data: "data",
            success: function(response) {
                if (response.status !== 0) {
                    return layer.msg("获取分类数据失败！")
                }
                var htmlStr = template("tmp_cate", response)
                    // console.log(htmlStr);
                $("[name=cate_id]").html(htmlStr)
                    // 通知layui重新渲染表单区域ui结构
                layui.form.render();
            }
        });
    };
    $("#form-search").on("submit", function(e) {
        e.preventDefault();
        var cate_id = $("[name=cate_id]").val()
        var state = $("[name=state]").val();
        q.cate_id = cate_id;
        q.state = state;
        initTable()
    });
    // 定义渲染分页的方法
    function renderPage(total) {
        // console.log(total);
        laypage.render({
            elem: "pageBox", //分页容器ID名
            count: total, //总数据条数
            limit: q.pagesize, //每页显示几条数据
            curr: q.pagenum, //设置默认被选择分页
            layout: ["count", "limit", 'prev', 'page', 'next', "skip"],
            limits: [2, 3, 5, 10],
            // 页码更换时，触发jump回调
            // jump回调方式有两种
            // 1、点击页码时，会触发jump回调
            //2、只要调用了laypage.render()就会被触发
            jump: function(obj, first) {
                // 可以通过first的来判断是通过那种方式触发的
                // 如果first为true证明是方式2触发的
                //否则是方式1触发的
                q.pagenum = obj.curr;
                // 通过obj.limit拿到切换分页
                q.pagesize = obj.limit
                if (!first) {
                    initCate();
                }
            }
        })
    };
    // 通过id删除文章
    $("tbody").on("click", ".btn-delete", function() {
        var id = $(this).attr("data-id");
        var len = $(".btn-delete").length
        layer.confirm('确认删除?', { icon: 3, title: '提示' }, function(index) {
            $.ajax({
                type: "GET",
                url: "/my/article/delete/" + id,
                success: function(response) {
                    if (response.status !== 0) {
                        return layer.msg("删除文章失败！")
                    }
                    layer.msg("删除文章成功！");
                    // 当数据删除完成后，需要判断当前这一页中，是否还有数据
                    // 用删除按钮个数进行判断，如果没有数据则让页码值-1
                    // 在重新调用initTable函数
                    // 如果按钮点击前个数为1证明删除完成之后没有数据
                    if (len == 1) {
                        q.pagenum = q.pagenum === 1 ? 1 : q.pagenum - 1
                    }
                    initTable();
                }
            });
            layer.close(index);
        });
    })
})